<template>
  <!-- <div> -->
  <a-card title="数据中转系统工作状态">
    <a-descriptions size="middle" :column="2" bordered style="box-sizing: border-box;">
      <a-descriptions-item label="CPU型号">
        {{ '/' }}
      </a-descriptions-item>
      <a-descriptions-item label="CPU使用率">
        {{ '/' }}
      </a-descriptions-item>
      <a-descriptions-item label="内存空间">
        {{ '/' }}
      </a-descriptions-item>
      <a-descriptions-item label="内存使用率">
        {{ '/' }}
      </a-descriptions-item>
      <a-descriptions-item label="存储空间">
        {{ '/' }}
      </a-descriptions-item>
      <a-descriptions-item label="存储使用率">
        {{ '/' }}
      </a-descriptions-item>
      <a-descriptions-item label="服务工作时长">
        {{ '/' }}
      </a-descriptions-item>
      <a-descriptions-item label="DAC工作状态">
        {{ '/' }}
      </a-descriptions-item>
      <a-descriptions-item label="DAC今日接收数据（帧）">
        {{ '/' }}
      </a-descriptions-item>
      <a-descriptions-item label="DAC今日转发数据（帧）">
        {{ '/' }}
      </a-descriptions-item>
      <a-descriptions-item label="系统工作状态">
        {{ '/' }}
      </a-descriptions-item>
      <a-descriptions-item label="服务ip">
        {{ '/' }}
      </a-descriptions-item>
      <a-descriptions-item label="状态更新时间">
        {{ '/' }}
      </a-descriptions-item>
    </a-descriptions>
  </a-card>
  <!-- </div> -->
</template>

<script>
import { mapGetters } from 'vuex'
import { getAction, httpAction } from '@/api/manage'
export default {
  // name: 'baseConfig',
  computed: {
    ...mapGetters(['websocketMsg']),
    websocketMsg() {
      return this.$store.state.user.websocketMsg
    }
  },
  watch: {
    websocketMsg: {
      handler(val) {
        let msg = JSON.parse(val)
        console.log(msg, '-----websocket的数据')
        if (msg.cmd == 'kgwl_sx') {
          this.getData()
        }
      }
    }
  },
  data() {
    return {
      formData: {},
      labelCol: { span: 10 },
      wrapperCol: { span: 14 },
      desData: {},
      url: {
        getByChannelCode: '/attr/nmcAttr/getByChannelCode'
      },
      options: [
        { resKey: 'tcpdk', webKey: 'tcpPort', label: 'TCP端口' },
        { resKey: 'ipdz', webKey: 'IPaddress', label: 'IP地址' },
        { resKey: 'wg', webKey: 'gateway', label: '网关' },
        { resKey: 'zwym', webKey: 'subnetMask', label: '子网掩码' },
        { resKey: 'macdz', webKey: 'MACaddress', label: 'MAC地址' },
        { resKey: 'ybk', webKey: 'controlModel', label: '控制模式' },
        { resKey: 'zbqh', webKey: 'primaryBackup', label: '主备份切换' },
        { resKey: 'kzfs', webKey: 'controlMode', label: '控制方式' },
        { resKey: 'sbzt', webKey: 'equipmentStatus', label: '设备状态' },
        { resKey: 'sbwd', webKey: 'temperature', label: '设备温度' }
      ]
    }
  },
  mounted() {
    this.getData()
  },
  methods: {
    getData() {
      let temp = {
        channelCode: '开关网络'
      }
      getAction(this.url.getByChannelCode, temp).then(res => {
        if (res.success) {
          res.result.forEach(i => {
            let key = this.options.find(j => j.resKey == i.attrName).webKey
            this.$set(this.desData, key, i.parseValue)
          })
        }
      })
    }
  }
}
</script>

<style scoped>
.ant-card-bordered {
  height: 100%;
  overflow: auto;
}
</style>
